<template>
    <div class="userList">
      <h3>用户查询</h3>
      <AreaWarp :padding="true">
        <SearchWarp :label="'姓名'">
          <el-input v-model.trim="searchInfo.realName"    placeholder="请输入用户姓名"></el-input>
        </SearchWarp>
        <SearchWarp :label="'手机号'">
          <el-input v-model.trim="searchInfo.mobile" maxlength="11" placeholder="请输入手机号码"></el-input>
        </SearchWarp>
        <BtnWarp>
          <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
          <el-button type="info" icon="el-icon-delete" @click="reset">重置</el-button>
        </BtnWarp>
      </AreaWarp>

      <AreaTitleWarp :title="'用户列表'"></AreaTitleWarp>


        <!--搜索结果区域-->
      <AreaWarp :padding="false">
        <el-table size="mini" :data="tableInfo.list" style="width: 100%" class="pub-table" header-row-class-name="pub-table-header-row" header-cell-class-name="pub-table-header-cell"
          tooltip-effect="dark"
        >
          <el-table-column prop="id" label="用户ID" min-width="120"></el-table-column>
          <el-table-column prop="realName" label="姓名" min-width="120"></el-table-column>
          <el-table-column prop="mobile" label="手机号" min-width="120"></el-table-column>
          <el-table-column prop="regtime" label="注册时间" min-width="120" :formatter="formatter_timeYMDHM"></el-table-column>
          <el-table-column v-if="checkShow" prop="id" label="操作" min-width="120">
            <template slot-scope="scope">
                <el-button type="text" size="small" @click="toUserDetail(scope.row)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>
      </AreaWarp>
    </div>
</template>
<script>
import User from "../../../assets/js/user.js";
export default {
  data() {
    return {
      searchInfo: {
        realName: "",
        mobile: "",
        size: 20,
        page: 1
      },
      loading: false,
      tableInfo: {
        list: [],
        total: 0,
        page: 0,
        size: 0
      },
      checkShow:false
    };
  },
  methods: {
    handleSizeChange(val) {
      let that = this;
      that.searchInfo.size = val;
      that.searchInfo.page = 1;
      that.search();
    },
    search(currentPage) {
      let that = this;
      that.searchInfo.page = typeof currentPage == "number" ? currentPage : 1;
      let x = {
        realName: that.searchInfo.realName,
        mobile: that.searchInfo.mobile,
        size: that.searchInfo.size,
        page: that.searchInfo.page
      };

      let user = new User(x);
      let reqData = user.getState();

      if (reqData.code) {
        that.showMsg(reqData.message, "error");
        return;
      }

      that.loading = true;
      that.ajaxJson({
        url: "/user/userList",
        data: reqData,
        success: function(res) {
          if (res.code == "0") {
            that.tableInfo.list = res.data;
          }
          that.loading = false;
        }
      });
    },
    reset() {
      let that = this;
      that.searchInfo = {
        realName: "",
        mobile: "",
        size: 20,
        page: 1
      };
      that.tableInfo = {
        list: [],
        total: 0,
        page: 0,
        size: 0
      };
      that.search();
    },
    // 查看详情
    toUserDetail(row) {
      let that = this;
      that.$emit("addTab", {
        tabOptions:
          "userInfoDetail_" + row.realName + "-" + row.id + "-用户详情",
        queryMsg: { method: "add", borrowId: row.borrowId, userId: row.id ,realName:row.realName}
      });
    },
    isCheckShow() {
      let that = this;
      let isCheckShow = that.urlPermissions().indexOf("/user/simpleUserDetail");
      if (isCheckShow == "-1") {
        that.checkShow = false;
      } else {
        that.checkShow = true;
      }
    }
  },
  created(){
    let that = this;
    that.isCheckShow()
  }
};
</script>
<style lang="less">
.userList {
}
</style>

